<div class="form-inline" ng-controller="FlowConfController" style="height: 200px; margin-left: 5px; margin-right: 5px;">

	<div class="panel  panel-default inline col-md-4">
		<div class="toolbar-head">
			节点表单初始化
			<span class="btn btn-primary glyphicon glyphicon-plus pull-right btn-sm" ng-hide="b && nodeInitList.length>0" ng-click="editNodeInit()"></span>
		</div>
		<div class="panel-body">
			<table class="table table-hover table-striped table-bordered">
				<tr>
					<th style="max-width: 100px">节点</th>
					<th>描述</th>
					<th>操作</th>
				</tr>
				<tr ng-repeat="nodeInit in nodeInitList track by $index">
					<th ab-tip title="{{nodeInit.nodeId}}">{{bpmDefSetting.nodeMap[nodeInit.nodeId].nodeName}}</th>
					<td>{{nodeInit.desc}}</td>
					<td>
						<a href="javascript:javaScript:void(0)" ng-click="ArrayTool.up($index,nodeInitList)" class="btn btn-primary btn-xs glyphicon glyphicon-chevron-up"></a>
						<a href="javascript:javaScript:void(0)" ng-click="ArrayTool.down($index,nodeInitList)" class="btn btn-primary btn-xs glyphicon glyphicon-chevron-down"></a>
						<span class="btn btn-danger btn-xs glyphicon glyphicon-trash pull-right" ng-click="ArrayTool.del($index,nodeInitList)"></span>
						<span class="btn btn-primary btn-xs glyphicon glyphicon-edit pull-right" ng-click="editNodeInit($index)"></span>
					</td>
				</tr>
			</table>
		</div>
	</div>
	<div class="panel  panel-default inline col-md-5">
		<div class="toolbar-head">
			节点通知消息
			<span class="btn btn-primary glyphicon glyphicon-plus pull-right btn-sm" ng-hide="b && nodeMessageList.length>1" ng-click="editNodeMessage()"></span>
		</div>
		<div class="panel-body">
			<table class="table table-hover table-striped table-bordered">
				<tr>
					<th style="max-width: 100px">节点</th>
					<th>时机</th>
					<th>描述</th>
					<th>操作</th>
				</tr>
				<tr ng-repeat="nodeMessage in nodeMessageList track by $index">
					<th>{{nodeMessage.nodeId?nodeMessage.nodeId:'所有节点'}}</th>
					<td>{{nodeMessage.event}}</td>
					<td ab-tip title="任务创建时通知任务候选人处理任务">{{nodeMessage.desc}}</td>
					<td>
						<span class="btn btn-danger btn-xs glyphicon glyphicon-trash pull-right" ng-click="ArrayTool.del($index,nodeMessageList)"></span>
						<span class="btn btn-primary btn-xs glyphicon glyphicon-edit pull-right" ng-click="editNodeMessage($index)"></span>
					</td>
				</tr>
			</table>
		</div>
	</div>
	<div class="panel  panel-default inline col-md-3">
		<div class="toolbar-head" ab-tip title="对流程中所使用的流程变量进行定义描述和约定">
			流程变量定义
			<span class="btn btn-primary glyphicon glyphicon-plus pull-right btn-sm" ng-click="editVariable()"></span>
		</div>
		<div class="panel-body">
			<table class="table table-hover table-striped table-bordered">
				<tr>
					<th style="max-width: 100px">KEY</th>
					<th>描述</th>
					<th>操作</th>
				</tr>
				<tr ng-repeat="var in variableList">
					<th>{{var.key}}</th>
					<td>{{var.name}}</td>
					<td>
						<span class="btn btn-danger btn-sm  glyphicon glyphicon-trash pull-right" ng-click="ArrayTool.del($index,variableList)"></span>
						<span class="btn btn-primary btn-sm  glyphicon glyphicon-edit pull-right" ng-click="editVariable($index)"></span>
					</td>
				</tr>
			</table>
		</div>
	</div>
	<div class="panel panel-default col-md-4 inline" style="margin-top: 6px" ng-show="pluginHasPermission('reminder')" ng-hide="b">
		<div class="toolbar-head">
			流程催办设置
			<span class="btn btn-primary glyphicon glyphicon-plus pull-right btn-sm" ng-click="editReminder()"></span>
		</div>
		<div class="panel-body">
			<table class="table table-hover table-striped table-bordered">
				<tr>
					<th style="max-width: 100px">催办节点</th>
					<th>描述</th>
					<th>操作</th>
				</tr>
				<tr ng-repeat="reminder in reminderList track by $index">
					<th>{{reminder.nodeId?reminder.nodeId:'所有节点'}}</th>
					<td>{{reminder.desc}}</td>
					<td>
						<a href="javascript:javaScript:void(0)" ng-click="ArrayTool.up($index,reminderList)" class="btn btn-primary btn-xs glyphicon glyphicon-chevron-up"></a>
						<a href="javascript:javaScript:void(0)" ng-click="ArrayTool.down($index,reminderList)" class="btn btn-primary btn-xs glyphicon glyphicon-chevron-down"></a>
						<span class="btn btn-danger btn-xs glyphicon glyphicon-trash pull-right" ng-click="ArrayTool.del($index,reminderList)"></span>
						<span class="btn btn-primary btn-xs glyphicon glyphicon-edit pull-right" ng-click="editReminder($index)"></span>
					</td>
				</tr>
			</table>
		</div>
	</div>

	<div class="panel panel-default col-md-4 inline" style="margin-top: 6px" ng-show="pluginHasPermission('carbonCopy')" ng-hide="b">
		<div class="toolbar-head">
			流程抄送设置
			<span class="btn btn-primary glyphicon glyphicon-plus pull-right btn-sm" ng-click="editCarbonCopy()"></span>
		</div>
		<div class="panel-body">
			<table class="table table-hover table-striped table-bordered">
				<tr>
					<th style="max-width: 100px">抄送节点</th>
					<th>描述</th>
					<th>操作</th>
				</tr>
				<tr ng-repeat="editCarbon in carbonCopyList track by $index">
					<th>{{editCarbon.nodeId}}</th>
					<td>{{editCarbon.desc}}</td>
					<td>
						<a href="javascript:javaScript:void(0)" ng-click="ArrayTool.up($index,editCarbonCopyList)" class="btn btn-primary btn-xs glyphicon glyphicon-chevron-up"></a>
						<a href="javascript:javaScript:void(0)" ng-click="ArrayTool.down($index,editCarbonCopyList)" class="btn btn-primary btn-xs glyphicon glyphicon-chevron-down"></a>
						<span class="btn btn-danger btn-xs glyphicon glyphicon-trash pull-right" ng-click="ArrayTool.del($index,carbonCopyList)"></span>
						<span class="btn btn-primary btn-xs glyphicon glyphicon-edit pull-right" ng-click="editCarbonCopy($index)"></span>
					</td>
				</tr>
			</table>
		</div>
	</div>

	<!-- 多实例配置 -->
	<div class="panel panel-default col-md-4 inline" style="margin-top: 6px" ng-show="pluginHasPermission('multInst')" ng-hide="b">
		<div class="toolbar-head">
			多实例配置
			<span class="btn btn-primary glyphicon glyphicon-plus pull-right btn-sm" ng-click="multInsts.push({})"></span>
		</div>
		<div class="panel-body">
			<table class="table table-hover table-striped table-bordered">
				<tr>
					<th>分发节点</th>
					<th>回收节点</th>
					<th>操作</th>
				</tr>
				<tr ng-repeat="multInst in multInsts track by $index">
					<td>
						<select ng-model="multInst.startNodeKey" class="form-control" ng-options="node.nodeId as node.nodeName for node in getNodeList('UserTask')" >
							<option value="">请选择</option>
						</select>
					</td>
					<td>
						<select ng-model="multInst.endNodeKey" class="form-control" ng-options="node.nodeId as node.nodeName for node in getNodeList('UserTask')" >
							<option value="">请选择</option>
						</select>
					</td>
					<td>
						<span class="btn btn-danger btn-xs glyphicon glyphicon-trash pull-right" ng-click="ArrayTool.del($index,multInsts)"></span>
					</td>
				</tr>
			</table>
		</div>
	</div>
</div>

<style>
.toolbar-head {
	border: 1px solid #ddd;
	padding: 10px 15px;
	font-size: 12px;
	font-weight: bold;
	color: #0E2D5F;
	height: 36px;
	line-height: 16px;
	background-color: #f5f5f5;
}

.code {
	white-space: pre-wrap!improtant;
	color: #c7254e;
	background-color: #f9f2f4;
	white-space: nowrap;
}

.panel.inline {
	display: inline-block;
	height: 100%
}

.panel.inline .panel-body {
	height: 100%
}
